import React from 'react'
import classnames from 'classnames'
import { View } from '@tarojs/components'
import { Info, IInfoProps } from '../Info'

import './index.scss'

export interface IconProps extends IInfoProps {
    name: string
    color?: string
    size?: number,
    customIconStyle?: React.CSSProperties
    customClass?: string
    onClick?: ()=> void
}

export const Icon: React.FC<IconProps> = ({
    name,
    color,
    size,
    customIconStyle,
    info,
    dot,
    customStyle,
    customClass = '',
    onClick
}) => {
    return (
        <View
          className={classnames('iconfont', `xxm-${name}`, customClass)}
          style={{
                color: color ? color : '',
                fontSize: size ? `${size}px` : '',
                ...customIconStyle
            }}
            onClick={()=>{
                if(onClick){
                    onClick()
                }
            }}
        >
            {(info !== null || dot) && <Info
              info={info}
              dot={dot}
              customStyle={customStyle}
            />
            }
        </View>
    )
}
